import {
    // 创建路由的api
    createRouter,
    // 创建路由的历史模式
    createWebHashHistory
} from 'vue-router'
import { ElLoading } from 'element-plus';

const router = createRouter({
    history: createWebHashHistory(),
    routes: [
        {
            redirect: '/index',
            path: "/"
        },
        {
            name: "index",
            path: "/home",
            component: () => import("@/view/home/index.vue"),
            children: [
                {
                    name: "index",
                    path: "/index",
                    menuName: "首页",
                    menuIcon: "Menu",
                    component: () => import("@/view/home/components/index/index.vue")
                },
                {
                    name: "set",
                    path: "/set",
                    menuName: "设置",
                    menuIcon: "Setting",
                    component: () => import("@/view/home/components/set/index.vue")
                },
                {
                    name: "set2",
                    path: "/set2",
                    menuName: "设置2",
                    menuIcon: "Setting",
                    component: () => import("@/view/home/components/set2/index.vue")
                }
            ]
        },
        {
            name: "login",
            path: "/login",
            component: () => import("@/view/login/index.vue")
        },
        {
            // 匹配所有未定义的路由
            path: '/:pathMatch(.*)*',
            name: 'NotFound',
            component: () => import('@/view/404/index.vue') // 这里假设 404 页面组件路径
        }
    ]
})

let loadingInstance = null;

// 路由守卫
router.beforeEach((to, from, next) => {
    loadingInstance = ElLoading.service({
        lock: true,
        text: '页面加载中，请稍后...',
        background: '#fff'
    });
    next();
});

router.afterEach(() => {
    if (loadingInstance) {
        loadingInstance.close();
    }
});

export default router